<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="author" content="Edy Segura" />
<meta name="reply-to" content="edy@segura.eti.br" />
<meta name="description" content="Componente para alternar as cores das linhas de uma tabela" />
<title>Componente Table</title>

<!-- stylesheet -->
<link rel="stylesheet" href="css/stylesheets.css" type="text/css" title="Padrão" />

<!-- javascript -->
<script type="text/javascript" src="js/Table/Table.js"></script>
<script type="text/javascript" src="js/Index.js"></script>

</head>
<body>

<h1>Componente Table</h1>
<p>
	Uso do componente <code>Table</code> para aplicar a técnica utilizada para alternar 
	as cores das linhas de uma tabela, também conhecida como &quot;zebra table&quot;. <br />
	Para mais detalhes veja o código fonte.
</p>

<h2>Resultado</h2>

<table id="zebratable">
	<caption>Tabela Completa</caption>
	
	<thead>
		<tr>
			<th>Header 1</th>
			<th>Header 2</th>
			<th>Header 3</th>
		</tr>
	</thead>
	
	<tfoot>
		<tr>
			<th colspan="3">WebEngineers - Consultoria e Desenvolvimento Web</th>
		</tr>
	</tfoot>
	
	<tbody>
		<tr>
			<td>Cell Content 1</td>
			<td>Cell Content 2</td>
			<td>Cell Content 3</td>
		</tr>
		<tr>
			<td>More Cell Content 1</td>
			<td>More Cell Content 2</td>
			<td>More Cell Content 3</td>
		</tr>
		<tr>
			<td>Even More Cell Content 1</td>
			<td>Even More Cell Content 2</td>
			<td>Even More Cell Content 3</td>
		</tr>
		<tr>
			<td>And Repeat 1</td>
			<td>And Repeat 2</td>
			<td>And Repeat 3</td>
		</tr>
		<tr>
			<td>Cell Content 1</td>
			<td>Cell Content 2</td>
			<td>Cell Content 3</td>
		</tr>
		<tr>
			<td>More Cell Content 1</td>
			<td>More Cell Content 2</td>
			<td>More Cell Content 3</td>
		</tr>
		<tr>
			<td>Even More Cell Content 1</td>
			<td>Even More Cell Content 2</td>
			<td>Even More Cell Content 3</td>
		</tr>
		<tr>
			<td>And Repeat 1</td>
			<td>And Repeat 2</td>
			<td>And Repeat 3</td>
		</tr>
	</tbody>
	
	<tbody>
		<tr>
			<td>Cell Content 1</td>
			<td>Cell Content 2</td>
			<td>Cell Content 3</td>
		</tr>
		<tr>
			<td>More Cell Content 1</td>
			<td>More Cell Content 2</td>
			<td>More Cell Content 3</td>
		</tr>
		<tr>
			<td>Even More Cell Content 1</td>
			<td>Even More Cell Content 2</td>
			<td>Even More Cell Content 3</td>
		</tr>
		<tr>
			<td>And Repeat 1</td>
			<td>And Repeat 2</td>
			<td>And Repeat 3</td>
		</tr>
		<tr>
			<td>Cell Content 1</td>
			<td>Cell Content 2</td>
			<td>Cell Content 3</td>
		</tr>
		<tr>
			<td>More Cell Content 1</td>
			<td>More Cell Content 2</td>
			<td>More Cell Content 3</td>
		</tr>
		<tr>
			<td>Even More Cell Content 1</td>
			<td>Even More Cell Content 2</td>
			<td>Even More Cell Content 3</td>
		</tr>
		<tr>
			<td>And Repeat 1</td>
			<td>And Repeat 2</td>
			<td>And Repeat 3</td>
		</tr>
	</tbody>
</table>

<table id="simpletable">
	<caption>Tabela Simples</caption>
	<tr>
		<td>Cell Content 1</td>
		<td>Cell Content 2</td>
		<td>Cell Content 3</td>
	</tr>
	<tr>
		<td>More Cell Content 1</td>
		<td>More Cell Content 2</td>
		<td>More Cell Content 3</td>
	</tr>
	<tr>
		<td>Even More Cell Content 1</td>
		<td>Even More Cell Content 2</td>
		<td>Even More Cell Content 3</td>
	</tr>
	<tr>
		<td>And Repeat 1</td>
		<td>And Repeat 2</td>
		<td>And Repeat 3</td>
	</tr>
	<tr>
		<td>Cell Content 1</td>
		<td>Cell Content 2</td>
		<td>Cell Content 3</td>
	</tr>
	<tr>
		<td>More Cell Content 1</td>
		<td>More Cell Content 2</td>
		<td>More Cell Content 3</td>
	</tr>
	<tr>
		<td>Even More Cell Content 1</td>
		<td>Even More Cell Content 2</td>
		<td>Even More Cell Content 3</td>
	</tr>
	<tr>
		<td>And Repeat 1</td>
		<td>And Repeat 2</td>
		<td>And Repeat 3</td>
	</tr>
	<tr>
		<td>Cell Content 1</td>
		<td>Cell Content 2</td>
		<td>Cell Content 3</td>
	</tr>
	<tr>
		<td>More Cell Content 1</td>
		<td>More Cell Content 2</td>
		<td>More Cell Content 3</td>
	</tr>
	<tr>
		<td>Even More Cell Content 1</td>
		<td>Even More Cell Content 2</td>
		<td>Even More Cell Content 3</td>
	</tr>
	<tr>
		<td>And Repeat 1</td>
		<td>And Repeat 2</td>
		<td>And Repeat 3</td>
	</tr>
	<tr>
		<td>Cell Content 1</td>
		<td>Cell Content 2</td>
		<td>Cell Content 3</td>
	</tr>
	<tr>
		<td>More Cell Content 1</td>
		<td>More Cell Content 2</td>
		<td>More Cell Content 3</td>
	</tr>
	<tr>
		<td>Even More Cell Content 1</td>
		<td>Even More Cell Content 2</td>
		<td>Even More Cell Content 3</td>
	</tr>
	<tr>
		<td>And Repeat 1</td>
		<td>And Repeat 2</td>
		<td>And Repeat 3</td>
	</tr>
</table>

</body>
</html>
